const path = require('path')
const webpack = require('webpack')
const htmlWebpackPlugin = require('html-webpack-plugin')
const config = require('./.config.js')
module.exports = {
  mode: 'development',
  devtool: 'cheap-module-source-map',
  module: {
    rules: [
      {
        test: /.css$/,
        use: [
          'style-loader',
          'css-loader',
          'postcss-loader'
        ]
      },
      {
        test: /.less$/,
        use: [
          'style-loader',
          'css-loader',
          'postcss-loader',
          'less-loader'
        ]
      },
      {
        test: /\.(png|jpe?g|fig|svg)$/,
        use: [
          {
            loader: 'url-loader',
            options: {
              esModule: false,
              limit: 6 * 1024,
              name: path.posix.join(config.staticPath, 'img/[name].[contenthash:6].[ext]')
            }
          }
        ]
      }
    ]
  },
  devServer: {
    contentBase: [path.join(__dirname, 'dist'), path.join(__dirname, 'public')],
    compress: true,
    port: 8082,
    publicPath: '/',
    hot: true,
    open: true,
    historyApiFallback: true,
    proxy: {}
  },
  plugins: [
    new htmlWebpackPlugin({
      title: config.envConfig.APP_TITLE,
      filename: 'index.html',
      template: config.htmlTemplate,
      hash: true,
      // inject: true,
      minify: false
    })
    // new webpack.HotModuleReplacementPlugin()
  ]
}
